<!DOCTYPE html>
<html lang="{{ site.locale | lang_base }}" dir="{{ site.locale | text_direction }}">
<head>
<meta charset="UTF-8">
<title>{% block title %}{{ title | fix }}{% endblock %}{{ " | "}}{{ site.name | fix }}</title>
<style type="text/css" nonce="{{ stylesheets_nonce() }}">
@font-face {
    font-family: 'Open Sans webfont';
    src: url('{{ site.chyrp_url }}/fonts/OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans webfont';
    src: url('{{ site.chyrp_url }}/fonts/OpenSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans webfont';
    src: url('{{ site.chyrp_url }}/fonts/OpenSans-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans webfont';
    src: url('{{ site.chyrp_url }}/fonts/OpenSans-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Open Sans webfont';
    src: url('{{ site.chyrp_url }}/fonts/OpenSans-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
}
@font-face {
    font-family: 'Open Sans webfont';
    src: url('{{ site.chyrp_url }}/fonts/OpenSans-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: 'Cousine webfont';
    src: url('{{ site.chyrp_url }}/fonts/Cousine-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Cousine webfont';
    src: url('{{ site.chyrp_url }}/fonts/Cousine-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Cousine webfont';
    src: url('{{ site.chyrp_url }}/fonts/Cousine-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: 'Cousine webfont';
    src: url('{{ site.chyrp_url }}/fonts/Cousine-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
}
html, body, div, dl, dt, dd, ul, ol, li, p,
h1, h2, h3, h4, h5, h6, img, pre, code,
form, fieldset, input, select, textarea,
table, tbody, tr, th, td, legend, caption,
blockquote, aside, figure, figcaption {
    margin: 0em;
    padding: 0em;
    border: 0em;
}
html {
    font-size: 16px;
}
table {
    border-collapse: collapse;
    border-spacing: 0em;
}
:root {
    color-scheme: light dark;
    --chyrp-pure-white: #ffffff;
    --chyrp-pure-black: #000000;
    --chyrp-inky-black: #1f1f23;
    --chyrp-summer-grey: #fbfbfb;
    --chyrp-english-grey: #efefef;
    --chyrp-welsh-grey: #dfdfdf;
    --chyrp-irish-grey: #cfcfcf;
    --chyrp-scottish-grey: #afafaf;
    --chyrp-winter-grey: #656565;
    --chyrp-strong-yellow: #ffdd00;
    --chyrp-strong-orange: #ff7f00;
    --chyrp-strong-red: #c11600;
    --chyrp-strong-green: #108600;
    --chyrp-strong-blue: #1e57ba;
    --chyrp-strong-purple: #ba1eba;
    --chyrp-light-yellow: #fffde6;
    --chyrp-light-red: #faebe4;
    --chyrp-light-green: #ebfae4;
    --chyrp-light-blue: #f2fbff;
    --chyrp-light-purple: #fae4fa;
    --chyrp-medium-yellow: #fffbcc;
    --chyrp-medium-red: #fcddcf;
    --chyrp-medium-green: #daf1d0;
    --chyrp-medium-blue: #e1f2fa;
    --chyrp-medium-purple: #f6d5f6;
    --chyrp-border-yellow: #e0ce8d;
    --chyrp-border-red: #cdaea5;
    --chyrp-border-green: #aecda5;
    --chyrp-border-blue: #a7c1d0;
    --chyrp-border-purple: #cda5cd;
}
*::selection {
    color: var(--chyrp-inky-black);
    background-color: var(--chyrp-strong-yellow);
}
body {
    font-family: "Open Sans webfont", sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--chyrp-inky-black);
    tab-size: 4;
    margin: 2rem;
    max-width: 1024px;
    background-color: var(--chyrp-pure-white);
}
h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    font-style: normal;
    font-variant: normal;
    margin: 1rem 0em;
    padding: 0rem;
}
h1 {
    font-size: 2em;
}
h2 {
    font-size: 1.5em;
}
h3, h4, h5, h6 {
    font-size: 1em;
    font-weight: 600;
    border-bottom: 1px solid var(--chyrp-irish-grey);
}
sup, sub {
    line-height: 1;
    font-size: 0.75em;
}
em, dfn, cite, var {
    font: inherit;
    font-style: italic;
}
figure, blockquote {
    margin-bottom: 1rem;
    font: inherit;
    font-size: 1rem;
}
blockquote {
    font-style: italic;
}
figcaption {
    font-size: 0.75em;
    margin-top: 0rem;
}
blockquote em {
    font-style: normal;
}
strong {
    font: inherit;
    font-weight: bold;
}
address {
    font: inherit;
}
small {
    font-size: 0.75em;
}
mark {
    color: var(--chyrp-inky-black);
    background-color: var(--chyrp-strong-yellow);
}
del, s {
    font: inherit;
    text-decoration: line-through;
    text-decoration-thickness: 0.125em;
}
ins {
    font: inherit;
    color: var(--chyrp-inky-black);
    background-color: var(--chyrp-medium-green);
}
p {
    margin-bottom: 1rem;
    hyphens: auto;
    hyphenate-limit-chars: 7 3 4;
}
ul {
    list-style: disc outside;
    margin: 1rem 0rem;
    margin-inline-start: 2rem;
    padding: 0rem;
}
ul ul {
    list-style-type: circle;
}
ol {
    list-style: decimal outside;
    margin: 1rem 0rem;
    margin-inline-start: 2rem;
    padding: 0rem;
}
ol ol {
    list-style-type: lower-roman;
}
dl {
    list-style: none;
}
dl dt {
    font-weight: bold;
}
dl dd {
    margin-left: 1rem;
}
hr {
    border: none;
    clear: both;
    border-top: 1px solid var(--chyrp-irish-grey);
    margin: 2rem 0rem;
}
aside {
    box-sizing: border-box;
    margin-bottom: 1rem;
    padding: 0.5rem;
    border: 1px solid var(--chyrp-border-yellow);
    border-radius: 0.25em;
    background-color: var(--chyrp-light-yellow);
}
pre {
    font-family: "Cousine webfont", monospace;
    font-size: 0.85em;
    background-color: var(--chyrp-english-grey);
    margin: 1rem 0rem;
    padding: 1rem;
    overflow-x: auto;
    white-space: pre;
}
pre:focus-visible {
    outline: var(--chyrp-strong-orange) dashed 2px;
}
code {
    font-family: "Cousine webfont", monospace;
    font-size: 0.85em;
    background-color: var(--chyrp-english-grey);
    padding: 2px 4px 0px 4px;
    border: 1px solid var(--chyrp-irish-grey);
    vertical-align: bottom;
    white-space: break-spaces;
}
pre > code {
    font-size: 0.85rem;
    display: block;
    border: none;
    padding: 0px;
    white-space: inherit;
}
img {
    max-width: 100%;
}
table {
    width: 100%;
    margin: 0rem 0rem 1rem 0rem;
    overflow-x: scroll;
}
table th {
    background-color: var(--chyrp-welsh-grey);
    padding: 0.5rem;
    font: inherit;
    font-weight: 600;
    text-align: center;
    vertical-align: middle;
    border: 1px solid var(--chyrp-scottish-grey);
}
table td {
    padding: 0.5rem;
    font: inherit;
    vertical-align: middle;
    border: 1px solid var(--chyrp-irish-grey);
}
table tbody tr:nth-child(even) td {
    background-color: var(--chyrp-summer-grey);
}
table tbody tr td.emblem {
    text-align: center;
}
td > *:first-child {
    margin-top: 0rem;
}
td > *:last-child {
    margin-bottom: 0rem;
}
a:link,
a:visited {
    color: var(--chyrp-inky-black);
    text-decoration: underline;
    text-underline-offset: 0.125em;
    text-decoration-thickness: 0.0625em;
}
a:hover,
a:focus,
a:active {
    outline: none;
    color: var(--chyrp-strong-blue);
    text-decoration: underline;
    text-underline-offset: 0.125em;
    text-decoration-thickness: 0.0625em;
}
a:focus-visible {
    outline: var(--chyrp-strong-orange) dashed 2px;
    outline-offset: 2px;
}
img.emblem,
a.emblem > img {
    display: inline;
    position: relative;
    top: 0.1875rem;
    height: 1rem;
}
@media screen and (min-width: 1080px) {
   body {
        margin: 2rem auto;
    }
}
@media (prefers-color-scheme: dark) {
    body {
        background-color: var(--chyrp-english-grey);
    }
    h3, h4, h5, h6 {
        border-color: var(--chyrp-scottish-grey);
    }
    hr {
        border-color: var(--chyrp-scottish-grey);
    }
    aside {
        background-color: var(--chyrp-medium-yellow);
        border-color: var(--chyrp-scottish-grey);
    }
    pre {
        background-color: var(--chyrp-welsh-grey);
    }
    code {
        background-color: var(--chyrp-welsh-grey);
        border-color: var(--chyrp-scottish-grey);
    }
    table tbody tr td {
        border-color: var(--chyrp-scottish-grey);
    }
    table tbody tr:nth-child(even) td {
        background-color: var(--chyrp-welsh-grey);
    }
}
</style>
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>
